@import "common.less";


.personal-r{
  min-height: 720px;
  .layui-tab {
    margin: 0;
    .fun-title {
      padding: 30px 0 0 60px;
      height: 144px;
      background-color: #fff;
      box-shadow: 0 12px 16px -3px rgba(82, 94, 140, 0.10);
      border-radius: 8px;
      position: relative;
      .fun-title-s {
        font-size: 26px;
        color: #4A4A4A;
        letter-spacing: 0;
        line-height: 26px;
      }
      .layui-tab-title {
        margin-top: 24px;
        border-bottom: none;
        li {
          margin-right: 74px;
          padding: 0;
          font-size: 16px;
          color: #4A4A4A;
          border: none;
        }
        .layui-this {
          border: none;
          color: #2F5AFF;
          &:after {
            border-width: 0;
            border-bottom: 2px solid #2F5AFF;
          }
        }
      }
      .calendar{
        text-decoration: none;
        position: absolute;
        top: 38px;
        right: 30px;
        .icon-calender{
          display: inline-block;
          width: 20px;
          height: 20px;
          background-color: #EEEEEE;
          margin-right: 10px;
        }
      }
    }
    .layui-tab-content {
      border-radius: 8px;
      overflow: hidden;
      width: 878px;
      padding: 30px 0 0 60px;
      .layui-tab-item{
        .curse-list{
          .curse-item{
            float: left;
            margin: 0 20px 20px 0;
            width: 258px;
            height: 261px;
            border-radius: 8px;
            overflow: hidden;
            background: #FFFFFF;
            border: 1px solid #EEEEEE;
            &:nth-child(3n){
              margin-right: 0;
            }
            .curse-img{
              display: block;
              width: 100%;
              height: 148px;
              margin-bottom: 15px;
              img{
                width: 100%;
                height: 100%;
              }
            }
            .curse-title{
              margin-bottom: 15px;
              .content-font-one();
              padding-left: 10px;
              font-size: 17px;
              color: #4A4A4A;
              letter-spacing: 0;
              line-height: 17px;
              font-weight: 600;
            }
            .last-date{
              padding-left: 10px;
              font-size: 15px;
              color: #4A4A4A;
              letter-spacing: 0;
              line-height: 15px;
              margin-bottom: 20px;
              i{
                font-style: normal;
              }
            }
            .c-fun-box{
              width: 100%;
              a{
                text-decoration: none;
                float: right;
                font-size: 14px;
                color: #6E6E6E;
                letter-spacing: 0;
                text-align: right;
                margin-right: 12px;
              }
            }
          }
        }
        #laypage-f,#laypage-s,#laypage-t{
          clear: both;
          .layui-laypage{
            margin: 60px 0 30px 230px;
            a,span{
              overflow: hidden;
              color: #999999;
              text-align: center;
              padding: 0;
              width: 31px;
              height: 31px;
              background: #F8F9FB;
              border-radius: 8px;
              margin-right: 20px;
            }
          }
        }
      }
    }
  }
}

.curse-eva{
  display:none;
  .full-shade{
    position:fixed;
    top:0;
    left:0;
    z-index:10003;
    width:100%;
    height:100%;
    background-color:#000;
    opacity:0.3;
    /*兼容IE8及以下版本浏览器*/
    filter: alpha(opacity=30);
    display:block;
  }
  .evaluate-box{
    display: none;
    border-radius: 8px;
    width: 517px;
    height: 595px;
    position: fixed;
    z-index:10004;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    .content-white-bg();
    .evaluate-style{
      overflow: hidden;
      display: block;
      position: relative;
      .eva-title{
        font-weight:600;
        text-align: center;
        font-size: 20px;
        color: #4A4A4A;
        letter-spacing: 0;
        line-height: 20px;
        margin:40px 0 40px;
      }
      .layui-icon-close{
        position: absolute;
        right: 20px;
        top: 20px;
        display: block;
        font-size: 30px;
        color: #9B9B9B;
      }
      .comm-content{
        width: 436px;
        margin:0 auto;
        .input-block{
          margin-bottom: 30px;
          display: block;
          overflow: hidden;
          .comm-title-label{
            font-size: 14px;
            color: #4A4A4A;
            letter-spacing: 0;
            line-height: 24px;
            font-weight:500;
            width: 60px;
            vertical-align: top;
          }
          #rate{
            .layui-rate{
              padding: 0;
            }
            .layui-icon-rate-solid::before
            ,.layui-icon-rate::before{
              font-size: 26px;
            }
          }
          #text-comm{
            padding: 15px;
            background: #F8F9FB;
            border-radius: 8px;
            width: 372px;
            height: 160px;
            border: none;
          }
        }
        .teacher-eva{
          margin-bottom: 20px;
          font-size: 16px;
          color: #4A4A4A;
          letter-spacing: 0;
          line-height: 16px;
        }
        .hint-choose-num{
          display: block;
          margin-bottom: 17px;
          font-size: 14px;
          color: #9B9B9B;
          letter-spacing: 0;
          line-height: 14px;
        }
        .comm-tip{
          display: block;
          overflow: hidden;
          margin-bottom: 30px;
          width: 440px;
          .tip-item{
            margin-right: 10px;
            margin-bottom: 10px;
            float: left;
            .tip-item-d{
              text-decoration: none;
              display: inline-block;
              padding: 6px 12px;
              border: 1px solid #DAE0FD;
              border-radius: 13.5px;
              font-size: 13px;
              color: #94A5FA;
              letter-spacing: 0;
              text-align: center;
              line-height: 13px;
            }
            .active{
              background: #94A5FA;
              color: #ffffff;
            }
          }
        }
        .post-comm{
          width: 100%;
          height: 40px;
          line-height: 40px;
          border-radius: 8px;
          background: #2F5AFF;
          font-size: 14px;
          color: #FFFFFF;
          letter-spacing: 0;
          text-align: center;
        }
      }
    }
  }
}